<template>
	<view class="main">
		 <br /><br /><br /><br /><br /><br />
		<uni-row>
			<uni-col :span="15" offset="1">
				<view class="one">
					<text>
						位于四川省成都市郫都区德源镇东林艺术村，是全国唯一经袁隆平院士授权以其名字命名的园区。
					</text>
				</view>
			</uni-col>
			<uni-col :span="16" offset="1">
				<view class="one">
					<text>
						全国首批科学家精神教育基地，园区以袁隆平院士为精神支柱，以稻蒜文化为基础，将科研场景
					</text>
				</view>
			</uni-col>
			<uni-col :span="16" offset="1">
				<view class="one">
					<text>
						变成教学场景，建立劳动教育、农业科普教育基地及成人实训基地。
					</text>
				</view>
			</uni-col>
		</uni-row>
		<br><br /><br /><br /><br /><br />
		<view>
			<uni-row>
				<uni-col :span="5" offset="1">
					<uni-card @click="toperson" class="card">
						<uni-row>
							<uni-col :span="2" offset="0.5">
								<view>
									<image class="btn-img" src="/static/1.png"></image>
								</view>
							</uni-col>
							<uni-col :span="15" offset="3">
								<uni-row>
									<view class="desc">
										<text>
											个人预约
										</text>
									</view>
								</uni-row>
								<uni-row>
									<view class="msg">
										<text>
											Personal reservation
										</text>
									</view>
								</uni-row>
							</uni-col>
						</uni-row>
					</uni-card>
				</uni-col>
			</uni-row>
		</view>
		<view>
			<uni-row>
				<uni-col :span="5" offset="1">
					<uni-card @click="toteam" class="card">
						<uni-row>
							<uni-col :span="2" offset="0.5">
								<view>
									<image class="btn-img" src="/static/2.png"></image>
								</view>
							</uni-col>
							<uni-col :span="15" offset="3">
								<uni-row>
									<view class="desc">
										<text>
											团队预约
										</text>
									</view>
								</uni-row>
								<uni-row>
									<view class="msg">
										<text>
											Group reservation
										</text>
									</view>
								</uni-row>
							</uni-col>
						</uni-row>
					</uni-card>
				</uni-col>
			</uni-row>
		</view>
		<view>
			<uni-row>
				<uni-col :span="5" offset="1">
					<uni-card @click="choose" class="card">
						<uni-row>
							<uni-col :span="2" offset="0.5">
								<view>
									<image class="btn-img" src="/static/3.png"></image>
								</view>
							</uni-col>
							<uni-col :span="15" offset="3">
								<uni-row>
									<view class="desc">
										<text>
											扫码进园
										</text>
									</view>
								</uni-row>
								<uni-row>
									<view class="msg">
										<text>
											Scan the QR code to enter the park
										</text>
									</view>
								</uni-row>
							</uni-col>
						</uni-row>
					</uni-card>
				</uni-col>
			</uni-row>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	
	let toperson = function() {
		uni.navigateTo({
			url: '/pages/leave/personnotice'
		})
	}
	
	let toteam = function() {
		uni.navigateTo({
			url: '/pages/leave/teamnotice'
		})
	}
	
	let choose = function() {
		uni.navigateTo({
			url: '/pages/leave/choose'
		})
	}
</script>

<style scoped>
	.one{
		width: 230px;
		height: 45px;
		font-family: PingFangSC-Regular;
		font-weight: 400;
		font-size: 10px;
		color: #05261B;
		letter-spacing: 0;
		line-height: 22px;
		padding: 0px 50px;
	}
	.card{
		width: 270px;
		height: 55px;
		background: #FFFFFF;
		border-radius: 12px;
	}
	.main{
		width: 100%;
		height: 626px;
		background-image: url(/static/back.png);
	}
	.img{
		width: 2px;
		height: 2px;
	}
	.msg{
		width: 200px;
		height: 17px;
		font-family: PingFangSC-Regular;
		font-weight: 400;
		font-size: 12px;
		color: #5F5F5F;
		letter-spacing: 0;
	}
	.btn-img{
		width: 32px;
		height: 32px;
		opacity: 10;
	}
	.desc{
		width: 61.48px;
		height: 17px;
		font-family: PingFangSC-Medium;
		font-weight: 500;
		font-size: 15px;
		color: #05261B;
		letter-spacing: 0;
	}
</style>
